<!DOCTYPE html>
<html lang="en">
<head>
<title>Home</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<!-- Custom Theme files -->
<link href="css/bootstrap.css" type="text/css" rel="stylesheet" media="all">
<link href="css/style.css" type="text/css" rel="stylesheet" media="all">
<link href="css/font-awesome.css" rel="stylesheet">		<!-- font-awesome icons -->
<link rel="stylesheet" href="css/lightbox.css">
<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
<!-- //Custom Theme files -->
<!-- js -->
<script src="js/jquery.min.js"></script>
<!-- //js -->
<!-- web-fonts -->
<link href="http://fonts.googleapis.com/css?family=Trochut:400,400i,700" rel="stylesheet">
<link href="http://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet">
<!-- //web-fonts -->
</head>
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
	<!-- banner -->
	<div id="home" class="w3ls-banner w3-agilefireworks jarallax">
		<!-- header -->
		<div class="header-w3layouts">
			<!-- Navigation -->
			<nav class="navbar navbar-default navbar-fixed-top">
				<div class="container">
					<div class="navbar-header page-scroll">
						<div class="timer">
							现在是
							<i id="year"></i>年
							<i id="month"></i>月
							<i id="days"></i>日
							<i id="hours"></i>时
							<i id="minutes"></i>分
						</div>
						<!--<div class="agileits-timer">-->
							<!--日历：-->
							<!--<div class="clock">-->
								<!--<div class="column days">-->
									<!--<div class="timer" id="days"></div>-->
									<!--<div class="text">日</div>-->
								<!--</div>-->
								<!--<div class="timer days"></div>-->
								<!--<div class="column">-->
									<!--<div class="timer"></div>-->
									<!--<div class="text">时</div>-->
								<!--</div>-->
								<!--<div class="timer"></div>-->
								<!--<div class="column">-->
									<!--<div class="timer" ></div>-->
									<!--<div class="text">分</div>-->
								<!--</div>-->
								<!--<div class="timer"></div>-->
								<!--<div class="column">-->
									<!--<div class="timer"></div>-->
									<!--<div class="text">秒</div>-->
								<!--</div>-->
								<!--<div class="clearfix"> </div>-->
							<!--</div>-->
						<!--</div>-->
					</div>

				</div>
				<!-- /.container -->
			</nav>
		</div>
		<!-- //header -->
		<!-- banner-text -->
		<div class="banner-text">
			<!-- timer -->
			<h2>孔敏华</h2>
			<a href="#" class="wthree-btn popup-with-zoom-anim" style="font-family: Arial;font-size: 18px;">
				这是我们相爱的第 <i id="time">99999</i> 天
			</a>
			<!-- //timer -->
		</div>
		<!-- //banner-text -->
	</div>
	<!-- //banner -->
	<!-- welcome -->
	<div class="welcome"  >
		<div class="welcome-agileinfo">
			<div class="col-sm-6 col-xs-6 welcome-w3left">
				<div class="col-xs-3 welcome-w3limg">
					<i class="fa fa-calendar-plus-o" aria-hidden="true"></i>
				</div>
				<div class="col-xs-9 welcome-w3ltext">
					<p>始于</p>
					<h4>04 10 2019</h4>
					<h6>开始于 上午 : 10:00 </h6>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="col-sm-6 col-xs-6 welcome-w3right">
				<div class="col-xs-9 welcome-w3ltext">
					<p>地点</p>
					<h4>广州, 广东</h4>
					<h6>T.I.T创意园 </h6>
				</div>
				<div class="col-xs-3 welcome-w3limg">
					<i class="fa fa-street-view" aria-hidden="true"></i>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	<!-- //welcome -->
	<!-- fireworks scripts -->
	<script type="text/javascript" src="js/jquery.fireworks.js"></script>
	<script>
		setTimeout(function() {
			$('.w3-agilefireworks').fireworks();
		});
	</script>
	<!-- //fireworks scripts -->
	<!-- timer scripts -->
	<script type="text/javascript" src="js/timer.js"></script>
	<!-- //scripts -->
	<!-- jarallax -->
	<script src="js/jarallax.js"></script>
	<script src="js/SmoothScroll.min.js"></script>
	<script type="text/javascript">
		/* init Jarallax */
		$('.jarallax').jarallax({
			speed: 0.5,
			imgWidth: 1366,
			imgHeight: 768
		})
	</script>
	<!-- //jarallax -->
	<!-- ResponsiveTabs js -->
	<script src="js/easyResponsiveTabs.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(document).ready(function () {
			$('#horizontalTab').easyResponsiveTabs({
				type: 'default', //Types: default, vertical, accordion
				width: 'auto', //auto or any width like 600px
				fit: true   // 100% fit in a container
			});
		});
	</script>
	<!-- //ResponsiveTabs js -->
	<!-- Scrolling Nav JavaScript -->
    <script src="js/scrolling-nav.js"></script>
	<!-- //fixed-scroll-nav-js -->
	<!-- pop-up-box -->
	<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
	<script>
		$(document).ready(function() {
		$('.popup-with-zoom-anim').magnificPopup({
			type: 'inline',
			fixedContentPos: false,
			fixedBgPos: true,
			overflowY: 'auto',
			closeBtnInside: true,
			preloader: false,
			midClick: true,
			removalDelay: 300,
			mainClass: 'my-mfp-zoom-in'
		});

		});
	</script>
	<!-- //pop-up-box -->
	<!-- start-smooth-scrolling -->
	<script type="text/javascript" src="js/move-top.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){
					event.preventDefault();

			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
				});
			});
	</script>
	<!-- //end-smooth-scrolling -->
	<!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/bootstrap.js"></script>
</body>
</html>
